<!--
* 严肃声明：
* 开源版本请务必保留此注释头信息，若删除gemframe官方保留所有法律责任追究！
* 本软件受国家版权局知识产权以及国家计算机软件著作权保护（登记号：2018SR503328）
* 不得恶意分享产品源代码、二次转售等，违者必究。
* Copyright (c) 2020 gemframework all rights reserved.
* http://www.gemframework.com
* 版权所有，侵权必究！
*/
-->
<!DOCTYPE html>
<html lang="zh-cn" class="fullscreen-bg" xmlns:th="http://www.thymeleaf.org">
<head>
    <title>请您登录 | GemFrame开源权限管理系统v1.0.0</title>
    <!--将title部分修改为对应的页面内容-->
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="keywords" content="JAVA SpringBoot SpringSecurity GemFrame admin"/>
    <meta name="description" content="基于SpringBoot2.0+的国产优秀的框架&GemFrame开源权限管理系统v1.0.0">
    <meta name="author" content="gemframework.com">
    <link href="static/img/custom/favicon.ico" rel="icon">
    <!-- Google Web Fonts -->
    <link rel="stylesheet" th:href="@{static/css/fonts/fonts-style.css}">
    <link rel="stylesheet" th:href="@{static/css/font-ubuntu.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/static/css/font-awesome-all.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/static/css/font-awesome.css}">
    <!-- Bootstrap CSS CDN -->
    <link rel="stylesheet" th:href="@{/static/js/bootstrap/bootstrap.min.css}">
    <!-- Page CSS -->
    <link rel="stylesheet" th:href="@{/static/css/custom/login1.css}">
    <style>
        .verifycode {
            display: block;
            width: 60%;
            padding: .375rem .75rem;
            font-size: 1rem;
            line-height: 1.5;
            color: #495057;
            background-color: #fff;
            background-clip: padding-box;
            border: 1px solid #ced4da;
            border-radius: .25rem;
            transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
        }
    </style>
    <div th:replace="common/links::layui_links"></div>
</head>
<body class="bg-login">
<div class="wrapper">
    <!-- Page Content Starts-->
    <div class="content-wrapper">
        <div class="mx-auto login">
            <a href="index.html">
                <img src="static/img/logo-signin.png"
                     class="img-circle" alt="Logo Image"></a>
            <div class="card card-signin mt-4">
                <div class="card-body">
                    <h5 class="card-title text-center">欢迎您登录</h5>
                    <form class="form-signin" th:action="@{/login}" method="post">
                        <div class="form-label-group">
                            <input type="text" id="username" name="username" class="form-control" value="admin"
                                   placeholder="用户名" required autofocus>
                        </div>
                        <div class="form-label-group">
                            <input type="password" id="password" name="password" class="form-control" value="123"
                                   placeholder="密码" required>
                        </div>
                        <div class="form-inline">
                            <input type="text" id="validcode" name="verifycode" class="verifycode" placeholder="验证码" required >
                            <img id="verifyImg" src="common/code" width="130" height="35" style="margin-left: 10px">
                        </div>

                        <hr/>
                        <div class="row remember">
                            <div class="col-md-7 text-center text-md-left">
                                <div class="custom-control custom-checkbox mb-3">
                                    <input type="checkbox" class="custom-control-input" id="customCheck1" name="remember-me" value="true">
                                    <label class="custom-control-label" for="customCheck1">记住密码</label>
                                </div>
                            </div>
                            <div class="col-md-5 text-center text-md-right mb-3">
                                <a href="#" class="">忘记密码？</a>
                            </div>
                            <!-- ${session?.SPRING_SECURITY_LAST_EXCEPTION?.message} security自带的错误提示信息 -->
                                <p style="color: red;margin-left: 18px" th:if="${param.error}">
                                    <b>错误信息：</b>
                                    <span th:text="${session?.SPRING_SECURITY_LAST_EXCEPTION?.message}" ></span>
                                </p>
                        </div>
                        <button type="submit" class="btn btn-primary btn-lg btn-block text-uppercase text-center">立即登录</button>
                        <hr class="my-4">
                        <div class="social-logins text-center">
                            <button class="btn btn-facebook" href="submit">
                                <i class="fa fa-facebook"></i>
                            </button>
                            <button class="btn btn-google" type="submit">
                                <i class="fa fa-google"></i>
                            </button>
                            <button class="btn btn-instagram" type="submit">
                                <i class="fa fa-instagram"></i>
                            </button>
                            <button class="btn btn-linkedin" type="submit">
                                <i class="fa fa-linkedin"></i>
                            </button>
                            <button class="btn btn-twitter" type="submit">
                                <i class="fa fa-twitter"></i>
                            </button>
                            <button class="btn btn-youtube" type="submit">
                                <i class="fa fa-youtube"></i>
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <!-- Page Content Ends-->
<!--    <div style="padding: 50px; line-height: 22px; background-color: #1e9fff; color: #fff; font-weight: 300;">-->
<!--        Hi，有缘人<br>-->
<!--        初次见面便与你一见如故<br>-->
<!--        你是我今生最美丽的相遇...<br>-->
<!--        <hr class="layui-bg-cyan">-->
<!--        <legend>温馨提示：</legend>-->
<!--        由于服务器资源有限，演示系统给您带来不便的体验<br>-->
<!--        敬请谅解~~~~~-->
<!--    </div>-->
</div>
<!-- Bootstrap JS -->
<!--<script th:src="@{static/cms/assets/js/jquery/jquery.min.js}"></script>-->
<div th:replace="common/links::jquery_script"></div>
<script th:src="@{http://cdn.bootstrapmb.com/bootstrap/4.1.0/js/bootstrap.min.js}"></script>
<div th:replace="common/links::layui_script"></div>
<script th:inline="javascript">

    $(function () {
        layui.use(['laydate', 'laypage', 'layer', 'table', 'carousel', 'upload', 'element'], function() {
            var laydate = layui.laydate //日期
                ,laypage = layui.laypage //分页
                ,layer = layui.layer //弹层
                ,table = layui.table //表格
                ,carousel = layui.carousel //轮播
                ,upload = layui.upload //上传
                ,element = layui.element; //元素操作 等等...
            if(top.location.href != self.location.href){
                layer.alert("登录超时，请重新登录！",{
                    closeBtn: 0
                    ,icon: 5
                    ,anim: 4 //动画类型
                },function(){
                    top.location.href=self.location.href;
                });
            }
        });
    });

    // 图形验证码
    $('#verifyImg').click(function () {
        this.src = this.src + '?t=' + (new Date).getTime();
    });
</script>
</body>
</html>
